import 'package:flutter/material.dart';
import 'package:flutter_app/utils/windowUtil.dart';
import 'package:flutter_swiper/flutter_swiper.dart';

class HomeWidget extends StatefulWidget {
  @override
  State<HomeWidget> createState() => _HomeWidgetState();
}

class _HomeWidgetState extends State<HomeWidget> {
  int _itemCount;

  bool _loop;

  bool _autoplay;

  int _autoplayDely;

  double _padding;

  bool _outer;

  double _radius;

  double _viewportFraction;

  SwiperLayout _layout;

  int _currentIndex;

  double _scale;

  Axis _scrollDirection;

  Curve _curve;

  double _fade;

  bool _autoplayDisableOnInteraction;

  CustomLayoutOption customLayoutOption;

  SwiperController _controller;

  var titles;
  var writers;
  var content;

  List<String> c = [
    "苏宁易购",
    '天猫超市',
    "天猫国际",
    '聚划算',
    '饿了么',
    '免费领水果',
    '大麦',
    '粉丝福利社',
    '淘票票',
    '分类'
  ];
  List<String> image = ["images/img.jpg", "images/img1.jpg", "images/img2.jpg"];
  FocusNode focusNode = new FocusNode();
  int index = 0;
  @override
  void initState() {
    super.initState();

    customLayoutOption = new CustomLayoutOption(startIndex: -1, stateCount: 3)
        .addRotate([-25.0 / 180, 0.0, 25.0 / 180]).addTranslate([
      new Offset(-350.0, 0.0),
      new Offset(0.0, 0.0),
      new Offset(350.0, 0.0)
    ]);
    _fade = 1.0;
    _currentIndex = 0;
    _curve = Curves.ease;
    _scale = 0.5;
    //  _scale = 0.5;
    _controller = new SwiperController();
    _layout = SwiperLayout.DEFAULT;
    _radius = 10.0;
    _padding = 0.0;
    _loop = true;
    _itemCount = 5;
    _autoplay = false;
    _autoplayDely = 3000;
    _viewportFraction = 0.2;
    _outer = false;
    _scrollDirection = Axis.horizontal;
    _autoplayDisableOnInteraction = false;
  //  compute(testisolate,null);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: Container(
          width: 50.0,
          height: 50.0,
          child: Image.asset(
            "images/scan.png",
            width: 30.0,
            height: 30.0,
          ),
          padding: EdgeInsets.all(10.0),
        ),
        backgroundColor: Color(0xffffff00),
        title: SizedBox(
          height: 30.0,
          child: Center(
              child: TextField(
            focusNode: focusNode,
            onTap: () {
              FocusScope.of(context).requestFocus(focusNode);
            },
            enabled: true,
            onSubmitted: (s) {
              print("finish");
            },
            textInputAction: TextInputAction.go,
            decoration: InputDecoration(
              contentPadding: EdgeInsets.only(left: 10.0, top: 5.0),
              hintText: "搜索商品",
              hintStyle: TextStyle(
                color: Color(0xffffffff),
              ),

              enabledBorder: OutlineInputBorder(
                /*边角*/
                borderRadius: BorderRadius.all(
                  Radius.circular(30), //边角为30
                ),
                borderSide: BorderSide(
                  color: Colors.white, //边线颜色为黄色
                  width: 2, //边线宽度为2
                ),
              ),
              focusedBorder: OutlineInputBorder(
                  borderRadius: BorderRadius.all(
                    Radius.circular(30), //边角为30
                  ),
                  borderSide: BorderSide(
                    color: Colors.white, //边框颜色为绿色
                    width: 2, //宽度为5
                  )),

              // errorText: "errorText",

              suffixIcon: Image.asset("images/search.png"),
              hasFloatingPlaceholder: false,
            ),
          )),
        ),
        centerTitle: true,
        actions: <Widget>[
          Container(
            width: 50.0,
            height: 50.0,
            child: Image.asset("images/talk.png"),
            padding: EdgeInsets.all(10.0),
            alignment: Alignment.center,
          )
        ],
      ),
      body: new ListView(
        children: <Widget>[
          Container(
            child: Column(
//              physics: NeverScrollableScrollPhysics(),
              children: <Widget>[
                Container(
                  child: GridView.count(
                    crossAxisCount: 5,
                    children: c.map((s) {
                      return getGridviewItem(s);
                    }).toList(),
                    shrinkWrap: true,
                    childAspectRatio: windowUtil.width / 5 / 60,
                    physics: NeverScrollableScrollPhysics(),
                  ),
                  padding: EdgeInsets.all(10.0),
                ),
                SizedBox(height: 10.0),
                SizedBox(
                  height: 150.0,
                  child: new Swiper(
                    itemBuilder: (BuildContext context, int index) {
                      return new Image.asset(image[index],
                          fit: BoxFit.fill,
                          height: MediaQuery.of(context).size.height * 0.2);
                    },
                    itemCount: 3,
                    autoplay: true,
                    onIndexChanged: (int s) {
                      index = s;
                      setState(() {});
                    },
                    pagination:
////          new SwiperPagination(builder: SwiperPagination.fraction),
                        new SwiperPagination(
                            builder: DotSwiperPaginationBuilder(
                      color: Colors.black54,
                      activeColor: Colors.white,
                    )),
                  ),
                ),
              ],
            ),
            decoration: BoxDecoration(
                image: DecorationImage(
                    image: AssetImage(image[index]), fit: BoxFit.fill)),
          ),
          gridview(),
          Row(
            crossAxisAlignment: CrossAxisAlignment.end,
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                  width: (windowUtil.width - 30) / 3,
                  height: (windowUtil.width - 30) / 2.5,
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    //crossAxisAlignment: CrossAxisAlignment.center,
                    children: <Widget>[
                      Image.asset("images/img.jpg",
                          width: 90.0, height: 90.0, fit: BoxFit.fill),
                      SizedBox(height: 10.0),
                      Text(
                        "精选",
                        style:
                            TextStyle(color: Color(0xff000000), fontSize: 12.0),
                        maxLines: 1,
                      )
                    ],
                  )),
              Container(
                  width: (windowUtil.width - 30) / 3,
                  height: (windowUtil.width - 30) / 2,
                  child: Swiper(
                    itemBuilder: (BuildContext context, int index) {
                      return new Image.asset(image[index],
                          fit: BoxFit.fill,
                          height: MediaQuery.of(context).size.height * 0.2);
                    },
                    itemCount: 3,
                    autoplay: true,
                    onIndexChanged: (int s) {


                    },
//                    pagination:
//////          new SwiperPagination(builder: SwiperPagination.fraction),
//                        new SwiperPagination(
//                            builder: DotSwiperPaginationBuilder(
//                      color: Colors.black54,
//                      activeColor: Colors.white,
//                    )),
                    scrollDirection: Axis.vertical,
                  )),
              Container(
                  width: (windowUtil.width - 30) / 3,
                  height: (windowUtil.width - 30) / 2.5,
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    //crossAxisAlignment: CrossAxisAlignment.center,
                    children: <Widget>[
                      Image.asset("images/img.jpg",
                          width: 90.0, height: 90.0, fit: BoxFit.fill),
                      SizedBox(height: 10.0),
                      Text(
                        "精选",
                        style:
                            TextStyle(color: Color(0xff000000), fontSize: 12.0),
                        maxLines: 1,
                      )
                    ],
                  ))
            ],
            mainAxisSize: MainAxisSize.max,
          ),
          Container(
            margin: EdgeInsets.only(left: 20.0, top: 20.0),
            child: Text(
              "平台精选",
              style: TextStyle(
                  color: Color(0xff000000), fontWeight: FontWeight.bold),
            ),
          ),
          Container(
            margin: EdgeInsets.only(
                left: windowUtil.dp_10, top: windowUtil.dp_10,right: windowUtil.dp_10),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Stack(

                  alignment: AlignmentDirectional.bottomStart,
                  children: <Widget>[
                    Container(
                      child: Image.asset(
                        "images/img2.jpg",
                        width: (windowUtil.width - 50) / 2,
                        height: (windowUtil.width - 50) / 1.5,
                        fit: BoxFit.fill,
                      ),
                    ),
                    Container(
                      width: (windowUtil.width - 50) / 2,
                      height: (windowUtil.width - 50) / 1.5*0.4,
                      child: Text("1",style: TextStyle(color: Color(0xffffffff)),),
                      decoration: BoxDecoration(color: Color(0x90000000)),
                    )
                  ],
                ),
                SizedBox(width: 10.0,),
                Stack(

                  alignment: AlignmentDirectional.bottomStart,
                  children: <Widget>[
                    Container(
                      child: Image.asset(
                        "images/img2.jpg",
                        width: (windowUtil.width - 50) / 2,
                        height: (windowUtil.width - 50) / 1.5,
                        fit: BoxFit.fill,
                      ),
                    ),
                    Container(
                      width: (windowUtil.width - 50) / 2,
                      height: (windowUtil.width - 50) / 1.5*0.4,
                      child: Text("1",style: TextStyle(color: Color(0xffffffff))),
                      decoration: BoxDecoration(color: Color(0x90000000)),
                    )
                  ],
                )
              ],
            ),
          )
          // buildSwiper()
        ],
      ),
      floatingActionButton: FloatingActionButton(onPressed: null,child: Image.asset("images/ex3.png",width: 50.0,height: 50.0,fit: BoxFit.contain,),
          backgroundColor:Colors.transparent,elevation: 0.0,
        highlightElevation: 0.0,
      ),
    );
  }

  Widget getGridviewItem(String s) {
//    List<Widget> list=List();
//    for(int i=0;i<10;i++){
//      list.add(
//          Container(child: Image.asset("images/img.jpg",width: 30.0,height: 30.0)),)
//          ;
//    }
//
//    return list;

    return GestureDetector(
      child: Column(
        //crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          Image.asset(
            "images/img.jpg",
            width: 30.0,
            height: 30.0,
          ),
          SizedBox(height: 10.0),
          Text(
            s,
            style: TextStyle(color: Color(0xff000000), fontSize: 12.0),
            maxLines: 1,
          )
        ],
      ),
      onTap: () {
        print(s);
      },
    );
  }

  Widget buildSwiper() {
    return new Swiper(
      onTap: (int index) {
        print(">>>>>>>>>>>>>>>>>>>>");
//        Fluttertoast.showToast(msg: " is clicked");
//        Navigator
//            .of(context)
//            .push(new MaterialPageRoute(builder: (BuildContext context) {
//          return Scaffold(
//            appBar: AppBar(
//              title: Text("New page"),
//            ),
//            body: Container(),
//          );
//        }));
      },
      customLayoutOption: customLayoutOption,
      fade: _fade,
      index: _currentIndex,
      onIndexChanged: (int index) {
        setState(() {
          _currentIndex = index;
        });
      },
      curve: _curve,
      scale: _scale,
      itemWidth: 100.0,
      // itemWidth: 100.0,
      controller: _controller,
      layout: _layout,
      outer: _outer,
      itemHeight: 50.0,
      viewportFraction: _viewportFraction,
      autoplayDelay: _autoplayDely,
      loop: _loop,
      autoplay: _autoplay,
      itemBuilder: _buildItem,
      itemCount: _itemCount,
      scrollDirection: _scrollDirection,
      autoplayDisableOnInteraction: _autoplayDisableOnInteraction,
      pagination: new SwiperPagination(),
    );
  }

  Widget _buildItem(BuildContext context, int index) {
    return new GestureDetector(
      onTap: () {
        print(">>>>>>>>>>>>>>>>>>>>> $index");
      },
      child: ClipRRect(
        borderRadius: new BorderRadius.all(new Radius.circular(_radius)),
        child: new Image.asset(
          "images/img.jpg",
          fit: BoxFit.fill,
        ),
      ),
    );
  }

  Widget gridview() {
    return GridView.count(
      crossAxisCount: 2,
      children: item(),
      shrinkWrap: true,
      physics: NeverScrollableScrollPhysics(),
      padding: EdgeInsets.all(5.0),
      mainAxisSpacing: 5.0,
      crossAxisSpacing: 5.0,
    );
  }

  List<Widget> item() {
    List<Widget> w = List();
    for (int i = 0; i < 4; i++) {
      w.add(new Container(
        width: (windowUtil.width - 30) / 2,
        height: (windowUtil.width - 30) / 2,
        decoration: BoxDecoration(
            color: Color(0xffF0FFF0), borderRadius: BorderRadius.circular(2.0)),
        child: Column(
          children: <Widget>[
            Text(
              "精选",
              style: TextStyle(
                  color: Color(0xff000000),
                  fontWeight: FontWeight.bold,
                  fontSize: 16.0),
            ),
            SizedBox(
              height: 10.0,
            ),
            Image.asset(
              "images/ex3.png",
              width: 100.0,
              height: 100.0,
              fit: BoxFit.fitHeight,
            ),
            Container(
              decoration: BoxDecoration(
                  color: Color(0xffFDF5E6),
                  border: Border.all(color: Colors.red),
                  borderRadius: BorderRadius.circular(2.0)),
              child: Text(
                "实惠好货",
                style: TextStyle(
                  color: Colors.red,
                ),
              ),
            )
          ],
        ),
      ));
    }
    return w;
  }



}
void testisolate(){
  while(true){
    print("iso");
  }

void t(){

}
}